<template>
  <div v-loading="loading" element-loading-text="加载中。。。">
    <el-card style="overflow:visible;">
      <el-form :model="form" size="mini" label-position="top" ref="form">
        <el-row :gutter="10">
          <el-col :lg="4" :md="6">
            <el-form-item label="多媒体类型" prop="MEDIATYPE">
              <el-select v-model="form.MEDIATYPE" filterable clearable placeholder="请选择多媒体类型" @change="changeMedia">
                <el-option v-for="item in mediaOption" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :lg="4" :md="6">
            <el-form-item label="受理渠道" prop="BUSICHANNEL">
              <el-select v-model="form.BUSICHANNEL" filterable clearable placeholder="请选择受理渠道"
                :disabled="form.MEDIATYPE==''" @change="changeChannel">
                <el-option v-for="item in channelOption" :key="item.FIELDKEY" :label="item.FIELDVALUE"
                  :value="item.FIELDKEY">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :lg="4" :md="6">
            <el-form-item label="业务类型" prop="BUSITYPE">
              <el-select v-model="form.BUSITYPE" filterable clearable placeholder="请选择业务类型"
                :disabled="form.BUSICHANNEL==''">
                <el-option v-for="item in typeOption" :key="item.FIELDKEY" :label="item.FIELDVALUE"
                  :value="item.FIELDKEY"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :lg="4" :md="6">
            <el-form-item label="开始日期" prop="startDate">
              <el-date-picker size="mini" style="width:100%;" v-model="form.startDate" type="date"
                value-format="yyyyMMdd" :clearable='false' placeholder="开始日期" :picker-options="pickerOptionsStart"
                @change="changeStart">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :lg="4" :md="6">
            <el-form-item label="结束日期" prop="endDate">
              <el-date-picker style="width:100%;" size="mini" v-model="form.endDate" type="date" value-format="yyyyMMdd"
                placeholder="结束日期" :picker-options="pickerOptionsEnd" @change="changeEnd" :clearable='false'>
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <!-- 按钮 -->
          <el-col :lg="12" :md="12" style="margin-top:10px;">
            <el-button type="primary" icon="el-icon-search" :loading="loading" size="mini" @click="query">查询</el-button>
          <!-- </el-col>
          <el-col :md="3" :lg="2" style="margin-top:10px;"> -->
            <el-button type='warning' size='mini' icon='el-icon-refresh' @click="clearForm('form')">重置</el-button>
          <!-- </el-col>
          <el-col :md="3" :lg="2" style="margin-top:10px;"> -->
            <el-button type="primary" size="mini" icon="el-icon-download" :disabled="tableData.length==0"
              @click="downloadTemplate">导出</el-button>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-card style="margin-top:10px;width:100%;overflow:scroll;">
      <!-- <el-row :gutter="10">
        <el-col :lg="2" :md="3" v-if="btnPermission('Button_User_Download')">
          <el-button type="primary" size="mini" icon="el-icon-download"
            :disabled="tableData.length==0" @click="downloadTemplate">导出</el-button>
        </el-col>
      </el-row> -->
      <!-- <table id="table5" style="margin-top:20px;">
        <tr>
          <th>多媒体类型</th>
          <th class="w200">受理渠道</th>
          <th class="w200">业务类型</th>
          <th class="w200">总进线量</th>
          <th class="w200">当前排队人数</th>
          <th class="w200">排队次数</th>
          <th class="w200">排队时长</th>
          <th class="w200">入Q次数</th>
          <th class="w200">振铃次数</th>
          <th class="w200">接通量</th>
          <th class="w200">会话建立次数</th>
          <th class="w200">话后整理次数</th>
          <th class="w200">挂断次数</th>
          <th class="w200">放弃次数</th>
          <th class="w200">呼损次数</th>
          <th class="w200">转接次数</th>
          <th class="w200">重新入队次数</th>
          <th class="w200">排队放弃量</th>
          <th class="w200">振铃放弃量</th>
          <th class="w200">放弃排队时间</th>
          <th class="w200">接通排队时间</th>
          <th class="w200">15S接通量</th>
          <th class="w200">20S接通量</th>
          <th class="w200">30S接通量</th>
          <th class="w200">呼损排队时间</th>
          <th class="w200">最大呼损时长</th>
          <th class="w200">系统呼损量</th>
          <th class="w200">系统呼损时长</th>
          <th class="w200">振铃呼损量</th>
          <th class="w200">振铃呼损排队时长</th>
          <th class="w200">5s中放弃量</th>
          <th class="w200">振铃总时长</th>
          <th class="w200">接听总时长</th>
          <th class="w200">通话总时长</th>
        </tr>
        <tr v-if="tableData.length == 0">
          <td colspan="34">
            暂无数据
          </td>
        </tr>
        <tr v-else="tableData.length>0" v-for="(item,i) in tableData">
          <td>{{item.MEDIATYPE}}</td>
          <td colspan="33">
            <table class="table2">
              <tr v-for="(par, j) in item.CHANNEL">
                <td class="w200">{{par.BUSICHANNEL | formatChannel}}</td>
                <td>
                  <table class="table3">
                    <tr v-for="val in par.TYPE">
                      <td class="w200">{{val.BUSITYPE | formatType}}</td>
                      <td class="w200">{{val.COILINCOUNT}}</td>
                      <td class="w200">{{val.CURRLINECOUNT}}</td>
                      <td class="w200">{{val.QUEUECOUNT}}</td>
                      <td class="w200">{{secondFormat(val.QUEUEDURN)}}</td>
                      <td class="w200">{{val.INQIUCOUNT}}</td>
                      <td class="w200">{{val.RINGINGCOUNT}}</td>
                      <td class="w200">{{val.ANSWERCOUNT}}</td>
                      <td class="w200">{{val.ESTABLISHEDCOUNT}}</td>
                      <td class="w200">{{val.AFTERCALLWORKCOUNT}}</td>
                      <td class="w200">{{val.RELEASECOUNT}}</td>
                      <td class="w200">{{val.CANCELCOUNT}}</td>
                      <td class="w200">{{val.CALLLOSTCOUNT}}</td>
                      <td class="w200">{{val.SWITCHCOUNT}}</td>
                      <td class="w200">{{val.BACKTOTEAMCOUNT}}</td>
                      <td class="w200">{{val.QUEUECANCELCOUNT}}</td>
                      <td class="w200">{{val.RINGINGCANCELCOUNT}}</td>
                      <td class="w200">{{secondFormat(val.CANCELQUEUEDURN)}}</td>
                      <td class="w200">{{secondFormat(val.ANSWERQUEUEDURN)}}</td>
                      <td class="w200">{{val.ANSWER15COUNT}}</td>
                      <td class="w200">{{val.ANSWER20COUNT}}</td>
                      <td class="w200">{{val.ANSWER30COUNT}}</td>
                      <td class="w200">{{secondFormat(val.CALLLOSTQUEUEDURN)}}</td>
                      <td class="w200">{{secondFormat(val.MAXCALLLOSTDURN)}}</td>
                      <td class="w200">{{val.SYSCALLLOSTCOUNT}}</td>
                      <td class="w200">{{secondFormat(val.SYSCALLLOSTDURN)}}</td>
                      <td class="w200">{{val.RINGCALLLOSTCOUNT}}</td>
                      <td class="w200">{{secondFormat(val.RINGCALLLOSTDURN)}}</td>
                      <td class="w200">{{val.CANCELIN5SCOUNT}}</td>
                      <td class="w200">{{secondFormat(val.RINGINGDURN)}}</td>
                      <td class="w200">{{secondFormat(val.ANSWERDURN)}}</td>
                      <td class="w200">{{secondFormat(val.ESTABLISHEDDURN)}}</td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>
          </td>
        </tr>
      </table> -->
      <lb-table :column="tableData.column" align="center" :data="tableData.data" :merge="['MEDIATYPE','BUSICHANNEL','BUSITYPE']" border>
      </lb-table>
    </el-card>
    <!-- 弹窗 -->
    <!-- <keep-alive>
      <component :is="dialogList.taskConfig" :option="dialogOptions"  @refreshTable="query"></component>
    </keep-alive> -->
  </div>
</template>

<script>
  import queueDaily from "@/message/siteManagement/report/queueDaily";
  import requestYg from "@/common/utils/requestYg";
  import getGlobalParams from "@/common/utils/getGlobalParams";
  import toolBox from "@/common/utils/toolBox";
  import dataQuery from '@/message/wfm/baseData/dictionaryManage/dictionaryQuery'
  import request from "@/common/utils/requestWFM";
  import LbTable from '@/components/lb-table/lb-table'
  let that
  export default {
    components: {
      LbTable
    },
    data() {
      return {
        tableData:{
          column: [{
            prop: 'MEDIATYPE',
            label: '多媒体类型',
            width: '100',
          }, 
          {
            prop: 'BUSICHANNEL',
            label: '受理渠道',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.formatChannel(scope.row.BUSICHANNEL)}
                  </span>
                </div>
              )
            },
          },
          {
            prop: 'BUSITYPE',
            label: '业务类型',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.formatType(scope.row.BUSITYPE)}
                  </span>
                </div>
              )
            },
            width:'100'
          },
          {
            prop: 'COILINCOUNT',
            label: '总进线量'
          },
          {
            prop: 'CURRLINECOUNT',
            label: '当前排队人数'
          },
          {
            prop: 'QUEUECOUNT',
            label: '排队次数'
          },
          {
            prop: 'QUEUEDURN',
            label: '排队时长',
            width: '110',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.secondFormat(scope.row.QUEUEDURN)}
                  </span>
                </div>
              )
            },
          },
          {
            prop: 'INQIUCOUNT',
            label: '入队次数'
          },
          {
            prop: 'RINGINGCOUNT',
            label: '振铃次数'
          },
          {
            prop: 'ANSWERCOUNT',
            label: '接通量'
          },
          {
            prop: 'ESTABLISHEDCOUNT',
            label: '会话建立次数'
          },
          {
            prop: 'AFTERCALLWORKCOUNT',
            label: '话后整理次数'
          },
          {
            prop: 'RELEASECOUNT',
            label: '挂断次数'
          },
          {
            prop: 'CANCELCOUNT',
            label: '放弃次数'
          },
          {
            prop: 'CALLLOSTCOUNT',
            label: '呼损次数'
          },
          {
            prop: 'SWITCHCOUNT',
            label: '转接次数'
          },
          {
            prop: 'BACKTOTEAMCOUNT',
            label: '重新入队次数'
          },
          {
            prop: 'QUEUECANCELCOUNT',
            label: '排队放弃量'
          },
          {
            prop: 'RINGINGCANCELCOUNT',
            label: '振铃放弃量'
          },
          {
            prop: 'CANCELQUEUEDURN',
            label: '放弃排队时间',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.secondFormat(scope.row.CANCELQUEUEDURN)}
                  </span>
                </div>
              )
            },
          },
          {
            prop: 'ANSWERQUEUEDURN',
            label: '接通排队时间',
            width: '110',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.secondFormat(scope.row.ANSWERQUEUEDURN)}
                  </span>
                </div>
              )
            },

          },
          {
            prop: 'ANSWER15COUNT',
            label: '15S接通量'
          },
          {
            prop: 'ANSWER20COUNT',
            label: '20S接通量'
          },
          {
            prop: 'ANSWER30COUNT',
            label: '30S接通量'
          },
          {
            prop: 'CALLLOSTQUEUEDURN',
            label: '呼损排队时间',
            width: '110',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.secondFormat(scope.row.CALLLOSTQUEUEDURN)}
                  </span>
                </div>
              )
            },
          },
          {
            prop: 'MAXCALLLOSTDURN',
            label: '最大呼损时长',
            width: '110',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.secondFormat(scope.row.MAXCALLLOSTDURN)}
                  </span>
                </div>
              )
            },
          },
          {
            prop: 'SYSCALLLOSTCOUNT',
            label: '系统呼损量'
          },
          {
            prop: 'SYSCALLLOSTDURN',
            label: '系统呼损时长',
            width: '110',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.secondFormat(scope.row.SYSCALLLOSTDURN)}
                  </span>
                </div>
              )
            },
          },
          {
            prop: 'RINGCALLLOSTCOUNT',
            label: '振铃呼损量'
          },
          {
            prop: 'RINGCALLLOSTDURN',
            label: '振铃呼损排队时长',
            width: '110',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.secondFormat(scope.row.RINGCALLLOSTDURN)}
                  </span>
                </div>
              )
            },
          },
          {
            prop: 'CANCELIN5SCOUNT',
            label: '5s中放弃量'
          },
          {
            prop: 'RINGINGDURN',
            label: '振铃总时长',
            width: '110',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.secondFormat(scope.row.RINGINGDURN)}
                  </span>
                </div>
              )
            },
          },
          {
            prop: 'ANSWERDURN',
            label: '接听总时长',
            width: '110',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.secondFormat(scope.row.ANSWERDURN)}
                  </span>
                </div>
              )
            },
          },
          {
            prop: 'ESTABLISHEDDURN',
            label: '通话总时长',
            width: '110',
            render: (h,scope) => {
              return (  
                <div>
                  <span>
                    {this.secondFormat(scope.row.ESTABLISHEDDURN)}
                  </span>
                </div>
              )
            },
          },
        ],
        data: []
        },
        pickerOptionsStart: {
          disabledDate: (time) => {
            return time.getTime() > Date.now() - 8.64e7
          }
        },
        pickerOptionsEnd: {
          disabledDate: (time) => {
            return time.getTime() > Date.now() - 8.64e7
          }
        },
        // tableData: [],
        channelOption: [],
        typeOption: [],
        mediaOption: [{
            value: 'video',
            label: '视频'
          },
          {
            value: 'voice',
            label: '电话'
          },
          {
            value: 'chat',
            label: '文字'
          },
        ],
        loading: false, //loading遮罩
        form: {
          startDate: this.getDay(-2),
          endDate: this.getDay(-1),
          MEDIATYPE: "", //多媒体类型
          BUSICHANNEL: "", //受理渠道
          BUSITYPE: "", //业务类型
        },
        fileUrl: getGlobalParams.get("FileDownloadAddress"),
      };
    },
    beforeCreate: function () {
      that = this;
    },
    filters: {
      
      
    },
    computed: {},
    created: function () {
      this.dictionaryQuery('BUSITYPE').then(value => this.typeOption = value)
      this.dictionaryQuery('BUSICHANNEL').then(value => this.channelOption = value)
      this.query()
    },
    watch: {},
    methods: {
      formatChannel (val){
        // console.log(that.dataOptions)
        let str = ''
        that.channelOption.forEach(item => {
          if (val == item.FIELDKEY) {
            str = item.FIELDVALUE
          }
        });
        return str
      },
      formatType(val){
        // console.log(that.dataOptions)
        let str = ''
        that.typeOption.forEach(item => {
          if (val == item.FIELDKEY) {
            str = item.FIELDVALUE
          }
        });
        return str
      },
      // 秒格式化
      secondFormat(value) {
        return toolBox.formatSeconds(value)
      },
      // 更改业务渠道
      changeChannel() {
        this.form.BUSITYPE = ''
      },
      //  开始日期
      changeStart() {
        this.pickerOptionsEnd = Object.assign({}, this.pickerOptionsEnd, {
          disabledDate: (time) => {
            if (this.form.startDate) {
              return time.getTime() < Date.parse(this.form.startDate.slice(0, 4) + '-' + this.form
                .startDate.slice(4, 6) +
                '-' + this.form.startDate.slice(6, 8)) - 8.64e7 || time.getTime() > Date.now() - 8.64e7;
            } else {
              return time.getTime() > Date.now() - 8.64e7;
            }
          }
        })
      },
      // 结束日期
      changeEnd() {
        this.pickerOptionsStart = Object.assign({}, this.pickerOptionsStart, {
          disabledDate: (time) => {
            if (this.form.endDate) {
              return time.getTime() > Date.parse(this.form.endDate.slice(0, 4) + '-' + this.form.endDate
                .slice(4, 6) + '-' +
                this.form.endDate.slice(6, 8)) || time.getTime() > Date.now() - 8.64e7;
            } else {
              return time.getTime() > Date.now() - 8.64e7;
            }
          }
        })
      },
      // 获取当天前一天
      getDay(day) {
        var dd = new Date();
        dd.setDate(dd.getDate() + day);
        var y = dd.getFullYear();
        var m = dd.getMonth() + 1 < 10 ? "0" + (dd.getMonth() + 1) : dd.getMonth() + 1;
        var d = dd.getDate() < 10 ? "0" + dd.getDate() : dd.getDate();
        return y + "" + m + "" + d;
      },
      // 导报班表
      async downloadTemplate() {
        let resBody
        resBody = new queueDaily()
        resBody.data.OPERFLAG = 'D'
        resBody.data.MEDIATYPE = this.form.MEDIATYPE
        resBody.data.BUSICHANNEL = this.form.BUSICHANNEL
        resBody.data.BUSITYPE = this.form.BUSITYPE
        resBody.data.SRTDATE = this.form.startDate
        resBody.data.ENDDATE = this.form.endDate
        let response = await requestYg(resBody);
        if (response.SYS_HEAD.ReturnCode == "000000") {
          let res = response.RSP_BODY
          let name = res.FileName
          let url = res.FilePath
          this.downloadFile(this.fileUrl + url + '/' + name)
          console.log('url', this.fileUrl + url + '/' + name)
        } else {
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          })
        }
      },
      changeMedia(data) {
        this.form.BUSICHANNEL = ''
        this.form.BUSITYPE = ''
        // console.log(data)
        // this.channelQuery(data).then(value => this.channelOption = value)

      },
      // 重置查询条件
      clearForm(item) {
        this.$refs["" + item].resetFields();
      },
      async dictionaryQuery(type) {
        let resBody = new dataQuery();
        resBody.data.FIELDCODE = type
        // resBody.data.FIELDNAME = this.form.name;
        resBody.data.CurrPage = 1
        resBody.data.PageRowNum = 200
        let response = await request(resBody);
        if (response.SYS_HEAD.ReturnCode == "000000") {
          return response.BODY.FIEDATA;
        } else {
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          })
        }
      },
      async channelQuery(media) {
        let resBody = new queueDaily();
        resBody.data.OPERFLAG = 'S'
        resBody.data.MEDIATYPE = this.form.MEDIATYPE
        let response = await requestYg(resBody);
        if (response.SYS_HEAD.ReturnCode == "000000") {
          return response.RSP_BODY.CHANNEL
        } else {
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          })
        }
      },
      query() {
        this.loading = true;
        let resBody = new queueDaily();
        resBody.data.OPERFLAG = 'S'
        resBody.data.MEDIATYPE = this.form.MEDIATYPE
        resBody.data.BUSICHANNEL = this.form.BUSICHANNEL
        resBody.data.BUSITYPE = this.form.BUSITYPE
        resBody.data.SRTDATE = this.form.startDate
        resBody.data.ENDDATE = this.form.endDate
        requestYg(resBody)
          .then(response => {
            if (response.SYS_HEAD.ReturnCode === "000000") {
              let data = response.RSP_BODY.Struct || [];
              let testData = []
              if (data.length > 0) {
                data.forEach(item => {
                  // testData.push({
                  //   'MEDIATYPE': item.MEDIATYPE,
                  // })
                  item.CHANNEL.forEach(el => {
                    el.TYPE.forEach(ele => {
                      testData.push({
                        'MEDIATYPE': item.MEDIATYPE,
                        'BUSICHANNEL':el.BUSICHANNEL,
                        'BUSITYPE':ele.BUSITYPE,
                        'COILINCOUNT':ele.COILINCOUNT,
                        'CURRLINECOUNT':ele.CURRLINECOUNT,
                        'QUEUECOUNT':ele.QUEUECOUNT,
                        'QUEUEDURN':ele.QUEUEDURN,
                        'INQIUCOUNT':ele.INQIUCOUNT,
                        'RINGINGCOUNT':ele.RINGINGCOUNT,
                        'ANSWERCOUNT':ele.ANSWERCOUNT,
                        'ESTABLISHEDCOUNT':ele.ESTABLISHEDCOUNT,
                        'AFTERCALLWORKCOUNT':ele.AFTERCALLWORKCOUNT,
                        'RELEASECOUNT':ele.RELEASECOUNT,
                        'CANCELCOUNT':ele.CANCELCOUNT,
                        'CALLLOSTCOUNT':ele.CALLLOSTCOUNT,
                        'SWITCHCOUNT':ele.SWITCHCOUNT,
                        'BACKTOTEAMCOUNT':ele.BACKTOTEAMCOUNT,
                        'QUEUECANCELCOUNT':ele.QUEUECANCELCOUNT,
                        'RINGINGCANCELCOUNT':ele.RINGINGCANCELCOUNT,
                        'CANCELQUEUEDURN':ele.CANCELQUEUEDURN,
                        'ANSWERQUEUEDURN':ele.ANSWERQUEUEDURN,
                        'ANSWER15COUNT':ele.ANSWER15COUNT,
                        'ANSWER20COUNT':ele.ANSWER20COUNT,
                        'ANSWER30COUNT':ele.ANSWER30COUNT,
                        'CALLLOSTQUEUEDURN':ele.CALLLOSTQUEUEDURN,
                        'MAXCALLLOSTDURN':ele.MAXCALLLOSTDURN,
                        'SYSCALLLOSTCOUNT':ele.SYSCALLLOSTCOUNT,
                        'SYSCALLLOSTDURN':ele.SYSCALLLOSTDURN,
                        'RINGCALLLOSTCOUNT':ele.RINGCALLLOSTCOUNT,
                        'RINGCALLLOSTDURN':ele.RINGCALLLOSTDURN,
                        'CANCELIN5SCOUNT':ele.CANCELIN5SCOUNT,
                        'RINGINGDURN':ele.RINGINGDURN,
                        'ANSWERDURN':ele.ANSWERDURN,
                        'ESTABLISHEDDURN':ele.ESTABLISHEDDURN,
                      })
                    })
                  })
                })
                this.tableData.data = testData
                console.log(this.tableData.data)
              }else{
                this.tableData.data  = []
              }
            } else {
              this.$message({
                type: "error",
                message: response.SYS_HEAD.ReturnMessage
              });
              this.tableData.data = [];
            }
            this.loading = false;
          })
          .catch(error => {
            this.loading = false;
          })
      },
    }
  };

</script>


<style lang="scss" scoped>
  #table5 {
    width: 3750px;
    table-layout: auto;
    overflow: scroll;
    color: #606266;
    // border: 1px solid #EBEEF5;
  }

  table {
    color: #606266;
    width: 100%;
    border-collapse: collapse;
    text-align: center;
    // overflow: scroll;
    table-layout: fixed;

  }

  #table5 th {
    // white-space: nowrap;
    // overflow: hidden;
    // background: #f7f7f7;
    text-align: center;
    font-size: 15px;
  }

  table th,
  td {
    padding: 0;
    margin: 0;
    border: 1px solid #EBEEF5;
    height: 30px;
    font-size: 14px;
  }

  .table2 tr td:nth-child(1) {
    border-left: 0;

  }

  .table2 tr td:nth-last-child(1) {
    border-right: 0;

  }

  .table2 tr:nth-child(1) td {
    border-top: 0;
  }

  // .table2 tr:nth-last-child(1) td {
  // border-bottom: 0;
  // }

  .w200 {
    width: 110px;
  }


  .selectTree {
    min-width: 150px;
  }

  .text {
    font-size: 14px;
  }

  .item {
    margin-bottom: 18px;
  }

  .dialog-text {
    display: inline-block;
    width: 100%;
    text-align: center;
    color: red;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }

  .clearfix:after {
    clear: both;
  }

  .el-form-item {
    margin-left: 30px;
  }

  .el-form-item1 {
    margin-left: 10px;
  }

  .box2-button {
    width: 80px;
  }

  .el-card {
    overflow: inherit;
  }

</style>
